<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>角色列表</title>
    <link rel="shortcut icon" href="favicon.ico"> 
    <!-- <link th:href="@{/css/ace.min.css}" rel="stylesheet"> -->
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{/css/font-awesome.css}" rel="stylesheet">
    <link th:href="@{/css/plugins/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet">
    <link th:href="@{/css/animate.css}" rel="stylesheet">
    <link th:href="@{/css/style.css}" rel="stylesheet">
    
    <link th:href="@{/plugins/jsTree/css/style.min.css}" rel="stylesheet" />
    <link th:href="@{/plugins/jqTreeGrid/css/jquery.treegrid.css}" rel="stylesheet" />
    
    <style type="text/css">
    	.b{
    		margin-bottom: 0px;
    	}
    	.fixed-table-container{
    	  padding-bottom: 80px !important;
    	}
    </style>
</head>
<body class="no-skin">
    <div class="wrapper wrapper-content animated fadeInRight">
        <!-- Panel Other -->
        <div class="ibox float-e-margins">
            <div class="ibox-content">
                <div class="row row-lg">
                    <div class="col-sm-12">
                    	<div>
	                    	<form id="searchFrm" class="form-horizontal" role="form">
									<div class="form-group b">
										<label class="col-sm-1 control-label" >角色名称</label>
										<div class="col-sm-2">
											<input type="text" id="selectRoleName" placeholder="角色名称" class="form-control" onkeydown="javascript:if(event.keyCode==13){search();return false};"/>
										</div>
				
										<label class="col-sm-1 control-label">状态</label>
										<div class="col-sm-2">
											<select id="selectStatus" name="attendanceType" class="form-control m-b">
												<option value="">--请选择--</option>
												<option value="1">正常</option>
												<option value="2">暂存</option>
											</select>
										</div>
									</div>
									<div align="right" style="margin-top: 8px">
										<button class="btn btn-sm btn-info" type="button" onclick="search();">
											<i class="ace-icon fa fa-share"></i>
												查询
										</button>
										<button class="btn btn-sm btn-info" type="button" onclick="resets();">
											<i class="ace-icon fa fa-share"></i>
												清空
										</button>
									</div>
								</form>
                    	</div>
                        <div style="margin: 5px 0px 0px 0px;padding: 5px 4px;background: #e7eaec">
                       		 <shiro:hasPermission name="sys:role:add">
                         		<button class="btn btn-success  btn-sm" type="button" onclick="addRole()"><i class="fa fa-plus"></i>&nbsp;&nbsp;<span class="bold">新增</span> </button>
                       		 </shiro:hasPermission>
                       		 <shiro:hasPermission name="sys:role:update">
                         		<button class="btn btn-info  btn-sm" type="button" onclick="editRole()"><i class="fa fa-paste"></i>&nbsp;&nbsp;<span class="bold">编辑</span> </button>
                       		 </shiro:hasPermission>
                       		 <shiro:hasPermission name="sys:role:menuToRole">
                         		<button class="btn btn-warning btn-sm" type="button" onclick="menuToRole()"><i class="fa fa-odnoklassniki-square"></i>&nbsp;&nbsp;<span class="bold">授权</span> </button>
                       		 </shiro:hasPermission>
                       		 <shiro:hasPermission name="sys:role:delete">
                         		<button class="btn btn-danger btn-sm" type="button" onclick="deleteRole()"><i class="fa fa-trash-o"></i>&nbsp;&nbsp;<span class="bold">删除</span> </button>
                       		 </shiro:hasPermission>
                        </div>
                        <div>
                             <table id="roleList" data-height="auto" data-mobile-responsive="true" style="margin-bottom: 50px"></table> 
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- End Panel Other -->
    </div>
 <div class="modal fade" id="addRole" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
        <div class="modal-dialog" style="margin-top:10%">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                            &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabels">
                      	  添加角色
                    </h4>
                </div>
	                <form class="form-horizontal" action="/sysRole/addSysRole" method="post" id="addRoleForm"  style="margin-top:10px">
		                <div class="modal-body">
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">角色名称:</label>
					                    <div class="col-sm-6">
					                      	 <input type="text" class="form-control" id="roleName" name="roleName" placeholder="角色名称" value=""  required="required"/>
					                    </div>
			                    </div>
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">角色编码:</label>
					                    <div class="col-sm-6">
					                      	 <input type="text" class="form-control" id="roleCode" name="roleCode" placeholder="角色编码" value=""  required="required"/>
					                    </div>
			                    </div>
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">状态:</label>
					                    <div class="col-sm-6">
					                      	 <select id="status" name="status" class="form-control m-b"  required="required">
														<option value="">--请选择--</option>
														<option value="1">正常</option>
														<option value="2">暂存</option>
											</select>
					                    </div>
			                    </div>
			             </div>
			             <div class="modal-footer">
		                     <button type="button" class="btn btn-default"  data-dismiss="modal">关闭</button>
		                     <button  class="btn btn-primary" type="submit">确定</button>
		                 </div>
	                </form>
            </div>
        </div>
    </div>
    
    <div class="modal fade" id="editRole" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
        <div class="modal-dialog" >
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                            &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabels">
                      	编辑角色
                    </h4>
                </div>
	                <form class="form-horizontal" action="/sysRole/editSysRole" method="post" id="editRoleForm"  style="margin-top:10px">
		                <div class="modal-body">
			                	<input type="hidden" name="id" id="updateId">  
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">角色名称:</label>
					                    <div class="col-sm-6">
					                      	 <input type="text" class="form-control" id="updateRoleName" name="roleName" placeholder="角色名称" value=""  required="required"/>
					                    </div>
			                    </div>
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">角色编码:</label>
					                    <div class="col-sm-6">
					                      	 <input type="text" class="form-control" id="updateRoleCode" name="roleCode" placeholder="角色编码" value=""  required="required"/>
					                    </div>
			                    </div>
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">状态:</label>
					                    <div class="col-sm-6">
					                      	<select id="updateStatus" name="status" class="form-control m-b"  required="required">
												<option value="">--请选择--</option>
												<option value="1">正常</option>
												<option value="2">暂存</option>
											</select>
					                    </div>
			                    </div>
			            </div>    
		                <div class="modal-footer">
		                    <button type="button" class="btn btn-default"  data-dismiss="modal">关闭</button>
		                    <button  class="btn btn-primary" type="submit">确定</button>
		                </div>
	                </form>
            </div>
        </div>
    </div>
    
    
    <div class="modal fade" id="detailRole" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
        <div class="modal-dialog" >
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                            &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabels">
                      	角色详情
                    </h4>
                </div>
	                <form class="form-horizontal" ethod="post" id="detailRoleForm"  style="margin-top:10px">
		                <div class="modal-body">
			                	<input type="hidden" name="id" id="detailId">  
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">角色名称:</label>
					                    <div class="col-sm-6">
					                      	 <input type="text" class="form-control" id="detailRoleName" name="roleName" placeholder="角色名称" value=""  disabled="disabled"/>
					                    </div>
			                    </div>
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">角色编码:</label>
					                    <div class="col-sm-6">
					                      	 <input type="text" class="form-control" id="detailRoleCode" name="roleCode" placeholder="角色编码" value=""  disabled="disabled"/>
					                    </div>
			                    </div>
			                    <div class="form-group">
			                    	    <label  class="col-sm-3 control-label">状态:</label>
					                    <div class="col-sm-6">
					                      	<select id="detailStatus" name="status" class="form-control m-b"  disabled="disabled">
												<option value="">--请选择--</option>
												<option value="1">正常</option>
												<option value="2">暂存</option>
											</select>
					                    </div>
			                    </div>
			            </div>  
			            <div class="modal-footer">
		                    <button type="button" class="btn btn-default"  data-dismiss="modal">关闭</button>
		                </div>  
	                </form>
            </div>
        </div>
    </div>
    
    
    <div class="modal fade" id="assignRoleMenu" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
        <div class="modal-dialog" >
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                            &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabels">
                      	分配菜单权限
                    </h4>
                </div>
	                <form class="form-horizontal" action="/sysRoleMenu/addSysAssignRoleMenu" method="post" id="assignRoleMenuForm"  style="margin-top:10px" onsubmit="return setMenu()">
		                <div class="modal-body">
			                    <input id="roleId"  name="roleId" type="hidden"> 
								<input id="menuIds" name="menuIds" type="hidden">
								<div class="form-group" style="margin-top: 10px">
									<label class="col-sm-3 control-label">当前角色：</label>
									<div class="col-sm-8">
										<input class="form-control" type="text" id="assignRoleName" disabled="disabled">
									</div>
								</div>
								<div class="form-group">
									<label class="col-sm-3 control-label">菜单权限：</label>
									<div class="col-sm-8">
										<div id="menuTree"></div>
									</div>
								</div>
			            </div>    
		                <div class="modal-footer">
		                    <button type="button" class="btn btn-default"  data-dismiss="modal">关闭</button>
		                    <button  class="btn btn-primary" type="submit">确定</button>
		                </div>
	                </form>
            </div>
        </div>
    </div>

    <!-- 全局js -->
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/plugins/layer/layer.min.js}"></script>
    <script th:src="@{/js/plugins/layer/laydate/laydate.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/plugins/bootstrap-table/bootstrap-table.min.js}"></script>
    <script th:src="@{/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js}"></script>
    <script th:src="@{/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
    
    <script type="text/javascript" th:src="@{/plugins/jqTreeGrid/js/jquery.treegrid.min.js}"></script>
    <script type="text/javascript" th:src="@{/plugins/jqTreeGrid/js/jquery.treegrid.bootstrap3.js}"></script>
    <script type="text/javascript" th:src="@{/plugins/jqTreeGrid/js/jquery.treegrid.extension.js}"></script>
    <script type="text/javascript" th:src="@{/plugins/jsTree/js/jstree.min.js}"></script>
    <!-- Peity -->
    <script th:src="@{/bootjs/menu/menuToRole.js}"></script>
    <script th:src="@{/bootjs/role/roleList.js}"></script>
    <script th:src="@{/bootjs/common/dateutil.js}"></script>

</body>

</html>
